<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>物品审批</title>
    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">

    <link rel="shortcut icon" href="favicon.ico">
    <link href="css/bootstrap.min.css-v=3.3.5.css"
          tppabs="http://www.zi-han.net/theme/hplus/css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
    <link href="css/font-awesome.min.css-v=4.4.0.css"
          tppabs="http://www.zi-han.net/theme/hplus/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="css/plugins/iCheck/custom.css"
          tppabs="http://www.zi-han.net/theme/hplus/css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="css/animate.min.css" tppabs="http://www.zi-han.net/theme/hplus/css/animate.min.css"
          rel="stylesheet">
    <link href="css/style.min.css-v=4.0.0.css" tppabs="http://www.zi-han.net/theme/hplus/css/style.min.css?v=4.0.0"
          rel="stylesheet">
    <!--    <base target="_blank">-->
    <link rel="stylesheet" type="text/css" href="./layui/css/layui.css"/>
    <style>
        #zhuti {
            height: 100%;

        }

        #zhuti::before {
            background: url('img/lg.jpg') no-repeat fixed center;
            background-size: 300px;
            content: "";
            opacity: 0.2;
            /*透明度设置*/
            width: 80%;
            height: 80%;
            position: absolute;
        }

        #xiaohuiid {
            border-top: 0;
            padding-left: 20px;
            height: 360px;
            background-color: #fff;
            margin-right: -15px;
            margin-left: -15px;
        }
    </style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">

    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins" id="zhuti">
                <div class="ibox-title">
                    <h3 style="font-weight: 600;margin-top: 0;">申请详情</h3>
                    <button onclick="correctExport()" class="btn-info" style="float: right;">导出Word</button>
                    <form action="/user/exportWord" class="word_form" method="post" style="display: none">
                        <input name="fid" class="word_input" type="text"/>
                        <input class="word_submit" type="submit"/>
                    </form>
                </div>

                <div class="ibox-content">
                    <!--                    upd意思为取消只读-->
                    <form method="post" autocomplete="off" class="form-horizontal layui-form" onsubmit="return false">
                    <div method="post" id="bigform" autocomplete="off" class="form-horizontal">
                        <div id="thing">

                        </div>


                        <div class="form-group">

                            <label class="col-sm-2 control-label">取走人</label>
                            <div class="col-sm-3">
                                <input id="qzr" type="text" name="fuzeren" required placeholder="请输入取走人姓名"
                                       class="form-control upd">
                            </div>

                            <label class="col-sm-2 control-label">校园卡号</label>
                            <div class="col-sm-4">
                                <input id="xykh" type="text" name="campusid" required placeholder="请输入取走人校园卡号"
                                       class="form-control upd">
                            </div>
                        </div>

                        <div class="form-group">

                            <label class="col-sm-2 control-label">联系方式</label>
                            <div class="col-sm-3">
                                <input id="lxfs" type="text" name="phoneid" required placeholder="请输入取走人联系电话"
                                       class="form-control upd">
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label">值班人</label>
                            <div class="col-sm-3">
                                <input id="zbr" type="text" name="fuzeren" required placeholder="请输入值班人姓名"
                                       class="form-control upd">
                            </div>

                            <label class="col-sm-2 control-label">借出备注</label>
                            <div class="col-sm-4">
                                <input type="text" name="outtime" required placeholder="请输入借出备注"
                                       class="form-control"
                                       id="jcbz">
                            </div>

                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label">借用的所有物品编号</label>
                            <div class="col-sm-3">
<!--                                <input id="allsigns" type="textarea" name="allsigns" required placeholder="请输入借用的所有物品编号"-->
<!--                                       class="form-control upd">-->
                                <textarea name="allsigns" id="allsigns" cols="30" rows="1" class="form-control upd"
                                          required placeholder="请输入借用的所有物品编号" style="font-size: 20px"></textarea>
                            </div>

                            <label class="col-sm-2 control-label">物品是否损坏</label>
                            <input type="checkbox" name="gongan1" lay-skin="switch" lay-filter="switchTest1"
                                   lay-text="是|否" class="form-control">
                        </div>
                        <!--弹出的损坏情况-->
                        <div class="form-group" style="display:none" zone="100" id="sunhuai">
                            <label class="col-sm-2 control-label">损坏情况</label>
                            <div class="col-sm-3">
                                <input type="text" name="demageDetail"  placeholder="请输入损坏情况"
                                       class="form-control size">
                            </div>
                        </div>

                        <div class="hr-line-dashed"></div>
                        <div class="form-group" id="tjj">
                            <div id='pycg' class="col-sm-3 col-sm-offset-4">
                                <input onclick='sy()' type='submit' style="margin-right: 40%;" id="tijiao"
                                       class="btn btn-primary"
                                       value="借出" >
                                <input  onclick='qx()' type='submit' style="margin-right: 40%;" id="quxiao"
                                        class="btn btn-primary"
                                        value="取消活动">
                                <a target="_self" href="showActivity.html">
                                    <input
                                           class="btn btn-info"
                                           value="返回">
                                </a>
                            </div>
                        </div>

                    </div>
                    </form>
                </div>
                <script src="./layui/layui.js" type="text/javascript" charset="utf-8"></script>
                <script src="js/jquery.min.js-v=2.1.4"
                        tppabs="http://www.zi-han.net/theme/hplus/js/jquery.min.js?v=2.1.4"></script>
                <script src="layui/layer/layer.js" type="text/javascript" charset="utf-8"></script>


                <script type="text/javascript">//----layui框架



                let id = 0;
                let state = "";
                let st = ''
                let et = ''
                let fid=''

                //页面入口函数
                $(document).ready(function ab() {
                    let x=GetRequest();
                    fid=x.fid
                    console.log(fid)
                    getDetail()
                });

                // 监听是否
                layui.use('form', function () {
                    var form = layui.form;
                    //公安
                    form.on('switch(switchTest1)', function (data) {
                        // console.log(data.elem.checked);
                        var ll = layui.$("input[name='gongan1']").is(':checked');
                        // layui.$(test).is(':checked');
                        if (data.elem.checked == false && $.trim(ll) == $.trim('true')) {
                            document.getElementById('sunhuai').style.display = 'none';
                        } else if (data.elem.checked == true && $.trim(ll) == $.trim('true')) {
                            document.getElementById('sunhuai').style.display = 'block';
                        } else if (data.elem.checked == false && $.trim(ll) == $.trim('false')) {
                            document.getElementById('sunhuai').style.display = 'none';
                        } else {
                            document.getElementById('sunhuai').style.display = 'none';
                        }
                        ;
                    });
                });

                <!--  导出word  -->
                function correctExport()
                {
                    $(".word_input").val(fid);
                    $(".word_form").submit();
                    //
                }
                //取走
                function sy() {
                    let qzr=$('#qzr').val()
                    let lxfs=$('#lxfs').val()
                    let zbr=$('#zbr').val()
                    let jcbz=$('#jcbz').val()
                    let xykh=$('#xykh').val()

                    //所有借出物品编号
                    let signs=$('#allsigns').val()
                    //是否损坏
                    let isdemage=0;
                    //损坏情况
                    let demagedetail=$('#demageDetail').val()
                    if (demagedetail==""){
                        isdemage=0;
                    }else {
                        isdemage=1;
                    }


                    console.log(fid,qzr,lxfs,zbr,jcbz)
                    $.ajax({
                        type: "POST",
                        url: "/user/outStock",
                        data: {
                            aid: parseInt(fid),
                            name: qzr,
                            tel: lxfs,
                            dutyPerson: zbr,
                            mes: jcbz,
                            isDamaged:isdemage,
                            damage:demagedetail,
                            signs:signs,
                            no:lxfs
                        },
                        success: function (msg) {
                            $("#tijiao").css("visibility","hidden");
                            $("#quxiao").css("visibility","hidden");
                            // $('#tijiao').hide();
                            // console.log(msg);
                            layer.alert(msg);
                            if(msg==='提交数据有误！'||msg==='请输入出库物品编号！'||msg==='物品编号数大于物品借用数！'||msg.startsWith('物品编号数量不足！')){
                                $("#quxiao").css("visibility","visible");
                                $("#tijiao").css("visibility","visible");
                            }else if(msg==='操作成功！'||msg==='操作失败，请稍后重试！'){
                                window.location.href='./showActivity.html';
                            }
                        }
                    });
                }


                //取消活动
                function qx(){
                    $.ajax({
                        type: "GET",
                        url: "/user/cancelAct",
                        data:{
                            "id":fid
                        },
                        success: function (msg) {
                            // alert("!!!!!!"+msg)
                            layer.alert(msg);
                            if (msg==='取消成功'){
                                $("#tijiao").css("visibility","hidden");
                                $("#quxiao").css("visibility","hidden");
                                // layer.alert(msg);
                                window.location.href='./showActivity.html';
                            }else {
                                layui.layer.alert(msg);
                            }
                        }
                    });
                }
                //拒绝
                function sy2() {
                    let app=$('#spr').val();
                    // let xx = "审批通过";
                    $.ajax({
                        type: "POST",
                        url: "user/doBorrowThingApply",
                        data: {
                            fid: 22,
                            approver: app,
                            mark:'0'
                        },
                        success: function (msg) {
                            $('#tijiao').hide()
                            $('#reset1').hide()
                            console.log(msg);
                            layer.alert(msg);
                        }
                    });
                }

                <!--	获取url后边的参数-->
                function GetRequest() {
                    const url = location.search; //获取url中"?"符后的字串
                    let theRequest = new Object();
                    if (url.indexOf("?") != -1) {
                        let str = url.substr(1);
                        let strs = str.split("&");
                        for (let i = 0; i < strs.length; i++) {
                            theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
                        }
                    }
                    return theRequest;
                }

                //分组
                function classify(arr){
                    let map = {};
                    let myArr = [];
                    for(let i = 0; i < arr.length; i++){
                        if(!map[arr[i].name]){
                            myArr.push({
                                name:arr[i].name,
                                data:[arr[i]]
                                // id: arr[i].id,
                                // data: [arr[i]]
                            });
                            map[arr[i].name] = arr[i]
                        } else {
                            for(let j = 0; j < myArr.length; j++){
                                if(arr[i].name === myArr[j].name){
                                    myArr[j].data.push(arr[i]);
                                    break
                                }
                            }
                        }
                    }
                    return myArr
                }

                //获取申请详情
                function getDetail() {
                    $.ajax({
                        type: "GET",
                        url: "user/getActById",
                        data: {
                            id: fid
                        },
                        success: function (msg) {
                            console.log(msg);
                            let list=msg.list
                            console.log(classify(list))
                            addThings(classify(list))
                        }
                    });
                }

                //填写底部输入框信息
                function filling(msg) {
                    $('#sqr').val(msg.applicant)
                    $('#lxdh').val(msg.tel)
                    $('#ssxy').val(msg.college)
                    $('#jyyy').val(msg.mes)
                    $('#test1').val(msg.startTime)
                    $('#test2').val(msg.endTime)
                }

                //动态添加物品及数量
                function addThings(msg) {
                    console.log(msg)
                    for (let i = 0; i < msg.length; i++) {
                        addName(msg[i].name)
                        let content = '<div class="form-group">'
                        let list = msg[i].data;
                        // console.log(list);
                        for (let j = 0; j < list.length; j++) {
                            content += addSize(list[j].size, list[j].num)
                        }
                        content = content + '</div>';
                        $('#thing').append(content);
                    }
                    addName('具体信息')
                }

                //添加一个物品名称
                function addName(name) {
                    let nameString = '<div class="ibox-title">\n' +
                        '                            <h3 style="font-weight: 600;margin-top: 0;padding-right: 500px;">\n' +
                        '                                ' + name + ':</h3>\n' +
                        '                        </div>'
                    $('#thing').append(nameString);
                }

                //添加物品的一个规格
                function addSize(size, number) {
                    let item = ' <label class="col-sm-3 control-label">' + size + ':</label>\n' +
                        '                            <div class="col-sm-2 row" style="margin-bottom: 14px;">\n' +
                        '                                <input disabled="disabled" value='+number+' type="number" class="form-control">\n' +
                        '                            </div>'
                    return item;
                }

                </script>


                <script src="js/bootstrap.min.js-v=3.3.5"
                        tppabs="http://www.zi-han.net/theme/hplus/js/bootstrap.min.js?v=3.3.5"></script>
                <script src="js/content.min.js-v=1.0.0"
                        tppabs="http://www.zi-han.net/theme/hplus/js/content.min.js?v=1.0.0"></script>
                <script src="js/plugins/iCheck/icheck.min.js"
                        tppabs="http://www.zi-han.net/theme/hplus/js/plugins/iCheck/icheck.min.js"></script>
                <script type="text/javascript" src="../../../tajs.qq.com/stats-sId=9051096"
                        tppabs="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
            </div>
        </div>
    </div>
</div>
</body>

</html>
